import { A, RouteDefinition } from "@solidjs/router";
import {
  ForgotPasswordRequest,
  ILoginRequest,
  LoginRequest,
  V1Client,
} from "@src/services/v1_client";
import { useClient } from "@src/utils/useHelper";
import { FcForm, FcFormItem, FcFormSubmit, TextBox } from "solid-fire-controls";
import { Component, createSignal } from "solid-js";

const client = useClient(V1Client);

const ResetPassword: Component = () => {
  return (
    <div class="row justify-content-center align-items-center w-100 h-100">
      <div class="col-12 col-sm-4">
        <h1>重置密码</h1>
        <div class="card">
          <div class="card-body">
            <FcForm initialValue={new ForgotPasswordRequest()}>
              <FcFormItem label="Email">
                <TextBox readonly classList={{ "mb-3": true }}></TextBox>
              </FcFormItem>
              <FcFormItem label="新密码">
                <TextBox
                  type="password"
                  clearable={false}
                  classList={{ "mb-3": true }}
                ></TextBox>
              </FcFormItem>
              <div class="w-100 ps-1 pe-1 mb-3">
                已有账号?去<A href="/login">登录</A>
              </div>
              <FcFormSubmit class="btn btn-primary w-100">
                确认重置
              </FcFormSubmit>
            </FcForm>
          </div>
        </div>
      </div>
    </div>
  );
};

export const ResetPasswordRoute: RouteDefinition = {
  path: "/reset-password",
  component: ResetPassword,
};

export default ResetPassword;
